<div class="dep-detail-wrap">
    <header class="page-header clearfix">
        <h4><a ng-href="#/app/dependency"><i class="fa fa-arrow-left"></i></a><span ng-if="vm.edit">编辑依赖组</span><span ng-if="!vm.edit">创建依赖组</span></h4>
        <ol class="breadcrumb">
            <li><a>我的应用</a></li>
            <li><a ng-href="#/app/dependency">应用依赖</a></li>
            <li class="active" ng-click="vm.showServiceList=!vm.showServiceList">创建依赖组</li>
        </ol>
    </header>
    <section>

        <form class="form-inline ser-form" novalidate name="serForm">
            <div class="dep-form-header">

                <div class="form-group padding-bottom-10 padding-top-10" ng-class="{'has-error': (serForm.name.$touched || baseForm.$submitted )
                 && (serForm.name.$error.required )}">
                    <label for="name"><span class="text-danger">*</span>依赖名称：</label>
                    <input type="text" class="form-control" ng-model="vm.name" required placeholder="请输入依赖名称" id="name" name="name" >
                    <span class="text-danger" ng-show="(serForm.name.$touched || baseForm.$submitted )
                 && (serForm.name.$error.required )">依赖名称不能为空</span>

                </div>

                <div class="form-group padding-bottom-10 padding-top-10" ng-class="{'has-error': (serForm.name.$touched || baseForm.$submitted )
                 && (serForm.name.$error.required )}" ng-if="vm.edit || !vm.chartEmpty" >
                    <label for="name"><span class="text-danger">*</span>根节点：</label>
                    <a href="javascript:;" ng-click="vm.openForm(vm.rootNode.name,true)">{{vm.rootNode.name}}</a>
                </div>

                <button type="button" class="btn btn-primary dep-submit" ng-disabled="serForm.$invalid || vm.chartEmpty || (!serForm.$dirty && !vm.chartChange)" ng-click="vm.save()">提交</button>

            </div>
            <div class="dep-form-body">
                <p class="dep-label padding-top-10"><span class="text-danger">*</span>服务依赖：</p>
                <div class="panel-chart">
                    <ui-chart config="vm.config"  model="vm.model"  unwatch class="graph-chart"></ui-chart>
                </div>
            </div>

        </form>

    </section>
</div>
